﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="login.aspx.cs" Inherits="WL_Store.Web.subpage.login" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
   
    <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="assets/css/font-awesome.min.css" />
		<!--[if IE 7]>
		  <link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />
		<![endif]-->
		<link rel="stylesheet" href="assets/css/ace.min.css" />
		<link rel="stylesheet" href="assets/css/ace-rtl.min.css" />
		<link rel="stylesheet" href="assets/css/ace-skins.min.css" />
        <link rel="stylesheet" href="css/style.css"/>
		<!--[if lte IE 8]>
		  <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
		<![endif]-->
		<script src="assets/js/ace-extra.min.js"></script>
		<!--[if lt IE 9]>
		<script src="assets/js/html5shiv.js"></script>
		<script src="assets/js/respond.min.js"></script>
		<![endif]-->
    
		<script src="js/jquery-1.9.1.min.js"></script>        
        <script src="assets/layer/layer.js" type="text/javascript"></script>
     <script  lang="javescript" type="text/javascript">
         function changeCode() {
             var imgNode = document.getElementById("vimg");
             imgNode.src = "/ashx/WaterMark.ashx?t=" + (new Date()).valueOf(); //加时间是为了解决缓存问题

         }
        

    </script>
    <script>
        $(function () {

            $("body").keydown(function () {
                if (event.keyCode == "13") {//keyCode=13是回车键
                    $('#login').click();//换成按钮的id即可
                }
            });


            $("#login").click(function () {
                //获取用户名、密码、验证码
                var name = $('#username').val();
                var password = $('#userpwd').val();
                var code =$('#Codes_text').val();
                $.ajax({
                    type: "post",
                    url: "/ashx/Login.ashx",
                    cache: false,
                    data: $("#form1").serialize(),
                    dataType: "json",   
                    beforeSend: function (data) {
                        if (name == "") {
                            //$('#ti').html("<i class='icon-warning-sign'>" + " <strong>请输入用户名！</strong>");
                            layer.tips("<i class='icon-warning-sign'></i><strong>请输入用户名！</strong>", "#username", { tips: [2, "#ffebeb"] });
                            
                            return false;
                        }
                        else if (password == "") {
                            //$('#ti').html("<i class='icon-warning-sign'>" + " <strong>请输入密码！</strong>");
                            layer.tips("<i class='icon-warning-sign'></i><strong>请输入密码！</strong>", "#userpwd", { tips: [2, "#ffebeb"] });
                            return false;
                        }
                        else if (code == "") {
                            //$('#ti').html("<i class='icon-warning-sign'>" + " <strong>请输入验证码！</strong>");
                            layer.tips("<i class='icon-warning-sign'></i><strong>请输入验证码！</strong>", "#Codes_text", { tips: [3, "#ffebeb"] });
                            return false;
                        }
                    },
                    
                    success: function (data) {
                        debugger;
                        //将json格式转换为json对象
                        //var json = eval("(" + data + ")");
                        //判断验证码是否正确
                        if (data.State == 0) {
                            //$('#ti').html("<i class='icon-warning-sign'>" + " <strong>" + data.Message + "</strong>");
                            layer.tips("<i class='icon-warning-sign'></i><strong>" + data.Message + "</strong>", "#Codes_text", { tips: [3, "#ffebeb"] });
                          
                            changeCode();
                        }
                        else {
                            if (data.State == 1) {
                                location.href = 'Index.aspx';
                            }

                            else {
                               // $('#ti').html("<i class='icon-warning-sign'>" + " <strong>" + data.Message + "</strong>")
                                //layer.tips("<i class='icon-warning-sign'></i><strong>验证码有误！！！</strong>", "#Codes_text", { tips: [3, "#c00"] });

                                layer.msg("<i class='icon-warning-sign'></i>用户名和密码不匹配");

                            }
                        }

                    }
                });

                //$.post("/ashx/Login.ashx", ( $("#form1").serialize()), function (data) {
                //    if (data == "false") {
                //        debugger;
                //        $('#ti').html("<i class='icon-warning-sign'>" + " <strong>验证码错误！</strong>");
                //    }
                //    else {
                //        debugger;
                //        if (data == "ok") {
                //            location.href = 'Index.aspx';
                //        }

                //        else {
                //            $('#ti').html("<i class='icon-warning-sign'>" + " <strong>用户名或密码错误！</strong>")
                //        }
                //    }
                //});




            });

        });
     </script>
    <style>
        .icon-warning-sign,strong {
        color:#e4393c;
        }
    </style>

<title>登录</title>
</head>
<body class="login-layout Reg_log_style">
   
        <div class="logintop">    
    <span>欢迎后台管理界面平台</span>    
    <ul>
    <li><a href="../Index.aspx">返回首页</a></li>
    <li><a href="#">帮助</a></li>
    <li><a href="#">关于</a></li>
    </ul>    
    </div>
    <div class="loginbody">
        <div class="login-container">
            <div class="center">
               <%-- <img src="../images/logo.jpg" style="width: 496px; height: 90px; margin-top: -50px;" />--%>
            </div>
            <div class="space-6"></div>

            <div class="position-relative">
                <div id="login-box" class="login-box widget-box no-border visible">
                    <div class="widget-body">
                        <div class="widget-main">
                            <h4 class="header blue lighter bigger">
                                <i class="icon-coffee green"></i>
                                管理员登录
                            </h4>

                            <div class="login_icon">
                                <img src="../images/login.png" /></div>

                            <form id="form1" runat="server">
                                <fieldset>
                                    <ul>
                                        <li class="frame_style form_error">
                                            <label class="user_icon"></label>
                                            <asp:TextBox ID="username" runat="server" type="text" placeholder="用户名"></asp:TextBox>
                                            
                                        </li>
                                        <li class="frame_style form_error">
                                            <label class="password_icon"></label>
                                            <asp:TextBox ID="userpwd" runat="server" type="password" placeholder="密码"></asp:TextBox>
                                           </li>
                                        <li class="frame_style form_error">
                                            <label class="Codes_icon"></label>
                                            <asp:TextBox ID="Codes_text" runat="server" name="验证码" type="text" placeholder="验证码"></asp:TextBox>
                                            
                                            <div class="Codes_region">
                                                <img src="/ashx/WaterMark.ashx" id="vimg" alt="" onclick="changeCode()" style="width: 80px; height: 33px" />
                                            </div>
                                        </li>
                                    </ul>
                                    <div id="ti" style="color: red;margin: 10px auto;text-align:center;height:20px">
                                       
                                    </div>

                                    <div class="clearfix">
                                        <label class="inline">
                                            <input type="checkbox" class="ace" checked="checked" />
                                            <span class="lbl">保存密码</span>
                                        </label>
                                       <%--<asp:Button ID="login_btn" runat="server" Text="登录" type="button" class="width-35 pull-right btn btn-sm btn-primary"  />--%>
                                        <input type="button" name="denglu"  value="登录" id="login" class="width-35 pull-right btn btn-sm btn-primary" />
                                    </div>

                                    <div class="space-4"></div>
                                </fieldset>
                            </form>

                            <div class="social-or-login center">
                                <span class="bigger-110">通知</span>
                            </div>

                            <div class="social-login center">
                                本网站系统不再对IE8以下浏览器支持，请见谅。
                            </div>
                        </div>
                        <!-- /widget-main -->

                        <div class="toolbar clearfix">
                        </div>
                    </div>
                    <!-- /widget-body -->
                </div>
                <!-- /login-box -->
            </div>
            <!-- /position-relative -->
        </div>
    </div>
                        <div class="loginbm">版权所有  2019  <a href="#">第三组</a> </div><strong></strong>
    
</body>
</html>
<script>
    $(document).ready(function () {
        $("input[type='text'],input[type='password']").blur(function () {

            var $el = $(this);
            var $parent = $el.parent();
            $parent.attr('class', 'frame_style').removeClass('form_error');
            if ($el.val() == '') {
                $parent.attr('class', 'frame_style').addClass('form_error');
            }

        });
        $("input[type='text'],input[type='password']").focus(function () {
            var $el = $(this);
            var $parent = $el.parent();
            $parent.attr('class', 'frame_style').removeClass('form_errors');
            if ($el.val() == '') {
                $parent.attr('class', 'frame_style').addClass('form_errors');
            } else {
                $parent.attr('class', 'frame_style').removeClass(' form_errors');
            }
        });
    });

</script>



